<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fun" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@include file="../../common/operation_forbid.jsp" %>
<%@include file="../../common/jsVersion.jsp" %>
<!DOCTYPE html >
<html lang="en">
<head>
<%@include file="../../common/includeBaseSet.jsp"%>
<%@include file="../../common/includeSystemSet.jsp"%>
<style type="text/css">
	.innerinputwrap .uploadimg{ margin-left:120px;}
	.uploadimg .inner:after{content:".";display:block;visibility:hidden;height:0;line-height:0;font-size:0;clear:both}
	.uploadimg .inner{zoom:1}
	.uploadimg .inner{ margin-left:-11px;}
	.uploadimg a{ float:left; display:block; width:108px; height:108px; border:solid 1px #ddd; margin-right:18px; margin-bottom:18px; cursor:pointer;}
	.uploadimg .checked{ border:dashed 1px #e74f44;}
	.uploadimg .add{ background:#eee url(${jypath}/resources/images/icon_add.png) no-repeat 50% 50%; border:dashed 1px #ddd;position:relative; overflow:hidden;}
	.uploadimg .add input{position:absolute;font-size:100px;right:0;top:0;opacity:0}
	.uploadimg .imgblock{ position:relative;}
	.uploadimg .imgblock:hover{ border:dashed 1px #e74f44;}
	.uploadimg .imgblock .close{ position:absolute; right:-11px; top:-11px; display:none; width:23px; height:23px; background:url(${jypath}/resources/images/icon_close.png) no-repeat;}
	.uploadimg .imgblock:hover .close{ display:block;}
	.uploadimgtt{ line-height:36px;}
</style>
<link rel="stylesheet" href="${jypath}/static/css/strip.css" />
</head>
<body>
	<div class="page-content">
		<div class="row">
			<div class="col-xs-12">
				<div class="widget-box">
					<div class="widget-header widget-header-flat">
						<h4><c:if test="${empty projectHouseType}">新增户型</c:if><c:if test="${!empty projectHouseType}">修改户型</c:if></h4>
					</div>
					<div class="widget-body">
						<div class="widget-main">
							<div class="row">
								<div class="col-xs-12">
									<form id="projectHouseTypeForm" class="form-horizontal" method="POST" onsubmit="return false;">
									    <input type="hidden" <c:if test="${!empty projectHouseType}">value="${projectHouseType.projectId}"</c:if> <c:if test="${empty projectHouseType}">value="${projectId}"</c:if> name="projectId" id="projectId"/>
									    <input type="hidden" id="projectHouseTypeId" value="${projectHouseType.id}" name="id"/>
										<div class="form-group">
											<label class="col-sm-3 control-label no-padding-right">户型名称：</label>
											<div class="col-sm-9">
												<span class="input-icon" style="width:100%">
												<input type="text" style="width:100%" name="houseTypeName" jyValidate="required" <c:if test="${!empty projectHouseType}">value="${projectHouseType.houseTypeName}"</c:if>>
												<i class="icon-edit"></i>
												</span>
											</div>		
										</div>
										<hr>
										<div class="form-group">
											<label class="col-sm-3 control-label no-padding-right">套内面积：</label>
											<div class="col-sm-9">
												<span class="input-icon" style="width:100%">
												<input type="text" style="width:100%" name="insideBuildingArea" jyValidate="float" length="10" precision="2" <c:if test="${!empty projectHouseType}">value="${projectHouseType.insideBuildingArea}"</c:if>>
												<i class="icon-edit"></i>
												</span>
											</div>		
										</div>
										<hr>
										<div class="form-group">
											<label class="col-sm-3 control-label no-padding-right">计费面积：</label>
											<div class="col-sm-9">
												<span class="input-icon" style="width:100%">
												<input type="text" style="width:100%" name="billingArea" jyValidate="float" length="10" precision="2" <c:if test="${!empty projectHouseType}">value="${projectHouseType.billingArea}"</c:if>>
												<i class="icon-edit"></i>
												</span>
											</div>		
										</div>
										<hr>
										<div class="form-group">
											<label class="col-sm-3 control-label no-padding-right">使用面积：</label>
											<div class="col-sm-9">
												<span class="input-icon" style="width:100%">
												<input type="text" style="width:100%" name="useArea" jyValidate="float" length="10" precision="2" <c:if test="${!empty projectHouseType}">value="${projectHouseType.useArea}"</c:if>>
												<i class="icon-edit"></i>
												</span>
											</div>		
										</div>
										<hr>
										<div class="form-group">
											<label class="col-sm-3 control-label no-padding-right">房型：
											</label>
											<div class="col-sm-9">
												<select class="col-sm-2" name="roomNum">
												 <option value="0">0</option>
												 <option value="1" 
												  
												  <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.roomNum eq 1}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                 </c:choose> 
			
												 >1</option>
												 <option value="2" 
												   <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.roomNum eq 2}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> 
                                                  >2</option>
												 <option value="3" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.roomNum eq 3}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >3</option>
												 <option value="4" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.roomNum eq 4}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >4</option>
												 <option value="5" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.roomNum eq 5}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >5</option>
												 <option value="6" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.roomNum eq 6}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >6</option>
												 <option value="7"<c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.roomNum eq 7}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >7</option>
												 <option value="8" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.roomNum eq 8}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >8</option>
												 <option value="9" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.roomNum eq 9}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >9</option>
												 <option value="10" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.roomNum eq 10}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >10</option>
							                    </select>
												<label class="col-sm-1 control-label no-padding-right center">室</label>
												<select class="col-sm-2" name="officeNum">
													<option value="0">0</option>
														 <option value="1" 
												  
												  <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.officeNum eq 1}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                 </c:choose> 
			
												 >1</option>
												 <option value="2" 
												   <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.officeNum eq 2}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> 
                                                  >2</option>
												 <option value="3" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.officeNum eq 3}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >3</option>
												 <option value="4" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.officeNum eq 4}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >4</option>
												 <option value="5" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.officeNum eq 5}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >5</option>
												 <option value="6" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.officeNum eq 6}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >6</option>
												 <option value="7"<c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.officeNum eq 7}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >7</option>
												 <option value="8" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.officeNum eq 8}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >8</option>
												 <option value="9" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.officeNum eq 9}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >9</option>
												 <option value="10" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.officeNum eq 10}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >10</option>
							                    </select>
												<label class="col-sm-1 control-label no-padding-right center">厅 </label>
												<select class="col-sm-2" name="guardNum">
													<option value="0">0</option>
														 <option value="1" 
												  
												  <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.guardNum eq 1}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                 </c:choose> 
			
												 >1</option>
												 <option value="2" 
												   <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.guardNum eq 2}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> 
                                                  >2</option>
												 <option value="3" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.guardNum eq 3}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >3</option>
												 <option value="4" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.guardNum eq 4}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >4</option>
												 <option value="5" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.guardNum eq 5}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >5</option>
												 <option value="6" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.guardNum eq 6}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >6</option>
												 <option value="7"<c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.guardNum eq 7}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >7</option>
												 <option value="8" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.guardNum eq 8}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >8</option>
												 <option value="9" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.guardNum eq 9}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >9</option>
												 <option value="10" <c:choose>
								                    <c:when test="${!empty projectHouseType && projectHouseType.guardNum eq 10}">
								                        selected
								                    </c:when>
								                    <c:otherwise>
								                    </c:otherwise>
                                                  </c:choose> >10</option>
							                    </select>
												<label class="col-sm-1 control-label no-padding-right center">卫 </label>
											</div>		
										</div>
										<hr>
										<div class="form-group">
											<label class="col-sm-3 control-label no-padding-right">部位：</label>
											<div class="col-sm-9">
											   <c:forEach var="position"   items="${positionEnum}">
											      <input type="checkbox" id="positionCheck_${position.no}" name="positionCheck" value="${position.no}">${position.des}
                                               </c:forEach>

											</div>		
										</div>
										<div class="form-group">
											<label class="col-sm-3 control-label no-padding-right">户型图：</label>
											<div class="col-sm-9">
											  <div class="innerinputwrap innermiddle"> 
						                            <div class="uploadimg"> 
						                              <div class="inner mt10" id="house_type_img_div"> 
						                                 <a class="add">  <input onchange="ajaxfile('house_type_img_div',this)"  type="file" name="file" id="file" />  </a>
						                                 <c:forEach var="img"   items="${houseTypeImgList}">
                                                           <a class="imgblock">
                                                           	<img height="108px" width="108px" src="${img.normalUrl}" onclick='showImg(this)'/>
                                                           	<em class=" close" onclick="removeImg(this)"> </em>
                                                           	</a>
                                                         </c:forEach>
						                            </div>
						                        </div>
											</div>
											<input type="hidden" value="" name="houseTypeUrls" id="houseTypeUrls">		
										</div>
										
										<hr>
	
										<div class="form-group" style="margin-left: 45%;">
											    &nbsp;&nbsp;
												<button class="btn btn-success btn-sm" onclick="projecthousetypeAdd()">保存</button>
												<button class="btn btn-info btn-sm" onclick="projecthousetypeBack()">返回</button>	
										</div>
									</form>										
								</div>				
							</div>
							
						
						</div>
					</div>
				
				
				
				</div>
			</div>
		</div>
		<%@include file="../../common/dialog.jsp" %>
	</div>
	<script src="${jypath}/resources/js/ajaxfileupload.js" type="text/javascript"></script>
	<script src="${jypath}/static/js/estate/projecthousetype/projecthousetype.js?v=${jsVersion}"></script>	
	<script type="text/javascript" src="${jypath}/static/js/strip.min.js"></script>
	<script >
		$(function () {
			var positions="${projectHouseType.position}";
			if(null!=positions && positions!=""){
				var position = positions.split(',');
				for(var i=0;i<position.length;i++){
					var row=position[i];
					$("#positionCheck_"+row).attr("checked","checked");
				}
			}
		});
		
	    function ajaxfile(imgDivId,obj){
		    var filePath=$("#file").val();
		    console.log("文件上传路径："+filePath);
		    if(!/\.(gif|jpg|jpeg|png|bmp|GIF|JPG|PNG|BMP)$/.test(filePath)){
		        alert('提示','您上传的图片格式不正确');
		        return;
		    }
		    console.log("文件上传参数验证通过，开始上传......");
		    $.ajaxFileUpload ({
				url:'${jypath}/common/file/uploadFile?type=1',
				secureuri:false,
				fileElementId:"file",
				dataType: 'json',
				success: function (data, status) {
					console.log(data);
					var url=data.url;
					var result=data.result;
					if(result!="0"){
						console.log("文件上传成功");
						//创建img
						var imgHtml='<a class="imgblock" onclick="showImg(this)"> <img height="108px" width="108px" src="'+url+'" /> <em class=" close" onclick="removeImg(this)"> </em> </a>';
						$("#"+imgDivId).append(imgHtml);
					}else{
						console.log("文件上传失败");
					}
					
				},
				error: function (data, status, e){
					alert('提示','上传失败','error');
		        }
			});
	    }
	    
	    function removeImg(obj){
	    	$(obj).parent().remove();
	    }
		</script>	
</body>
</html>